<template>
    <div :id="id">
        <div class="v-html" v-html="this.element.data.html" :class="this.element.data.html === '' ? 'back' : ''"></div>
    </div>
</template>

<script>
import register from '@/js/main/register.js';
export default {
    props: {
        element: {
            type: Object
        },
        id: {
            type: String
        },
        mode: {
            type: Number
        }
    },
    data() {
        return {
        };
    },
    created() {
        register.addComponent(this);
    },
    mounted() {},
    destroyed() {
        register.removeComponent(this);
    }
};
</script>

<style lang="scss" scoped>
.v-html {
    width: 100%;
    height: 100%;
}
.back {
    background: #1a1f32cc;
    background-image: url('../../image/main/iframe.svg');
    background-size: 100% 100%;
}

</style>